<!DOCTYPE html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../assert_selection.js"></script>
<script>
function mouseMoveTo(selection, id, side) {
  const element = selection.document.getElementById(id);
  const x = side == 'left' ? selection.computeLeft(element) - 1
                           : selection.computeRight(element) + 1;
  const y = selection.computeTop(element) + element.offsetHeight / 2;
  eventSender.mouseMoveTo(x, y);
}

function startDrag(selection, id, side) {
  mouseMoveTo(selection, id, side);
  eventSender.mouseDown();
}

function endDrag(selection, id, side) {
  mouseMoveTo(selection, id, side);
  eventSender.mouseUp();
}

selection_test(
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1</span>',
    '\u05D0\u05D0',
    '</div>'
  ],
  selection => {
    assert_not_equals(
        window.eventSender, undefined,
        'This test requires eventSender to simulate mouse operations');

    startDrag(selection, 'container', 'right');
    endDrag(selection, 'inline-block', 'right');
  },
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '^\u05D0\u05D0|',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1</span>',
    '\u05D0\u05D0',
    '</div>'
  ].join(''),
  'Create forward selection extended to inline block in RTL paragraph');

selection_test(
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1</span>',
    '\u05D0\u05D0',
    '</div>'
  ],
  selection => {
    assert_not_equals(
        window.eventSender, undefined,
        'This test requires eventSender to simulate mouse operations');

    startDrag(selection, 'container', 'right');
    endDrag(selection, 'inline-block', 'left');
  },
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '^\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1|</span>',
    '\u05D0\u05D0',
    '</div>'
  ].join(''),
  'Create forward selection extended beyond inline block in RTL paragraph');

selection_test(
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1</span>',
    '\u05D0\u05D0',
    '</div>'
  ],
  selection => {
    assert_not_equals(
        window.eventSender, undefined,
        'This test requires eventSender to simulate mouse operations');

    startDrag(selection, 'container', 'left');
    endDrag(selection, 'inline-block', 'left');
  },
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1</span>',
    '|\u05D0\u05D0^',
    '</div>'
  ].join(''),
  'Create backward selection extended to inline block in RTL paragraph');

selection_test(
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">\u05D1\u05D1</span>',
    '\u05D0\u05D0',
    '</div>'
  ],
  selection => {
    assert_not_equals(
        window.eventSender, undefined,
        'This test requires eventSender to simulate mouse operations');

    startDrag(selection, 'container', 'left');
    endDrag(selection, 'inline-block', 'right');
  },
  [
    '<div dir="rtl" id="container" style="width: 200px">',
    '\u05D0\u05D0',
    '<span id="inline-block" style="display: inline-block; margin: 10px">|\u05D1\u05D1</span>',
    '\u05D0\u05D0^',
    '</div>'
  ].join(''),
  'Create backward selection extended beyond inline block in RTL paragraph');
</script>
